iT邦幫忙

2019 iT 邦幫忙鐵人賽

DAY 30
3

打地鼠

這篇就寫個超廢的互動,就如我本人一樣嗚嗚

先把ticker的部分列出來,我覺得寫起來最痛苦的地方就是ticker,因為裡面的內容就是狂觸發,有時候想要寫控制就會卡住orz 想判斷超困難

let time = 0 // 紀錄現在時間跑多少
let timeSec = 100 // 多久跑完一次地鼠
let nowGophers = Math.floor((Math.random() * 10) % 9) //亂數選地鼠跳出
let count = 0 // 紀錄分數
let des = 150

app.ticker.add(function() {
  time++
  
  // 下一次的地鼠
  if (time > timeSec) {
    time = 0
    nowGophers = Math.floor((Math.random() * 10) % 9)
  }
  // 更新分數text
  text.text = 'Count: ' + count
  
  // 選到的洞做動畫互叫gopherAnim
  gopherAnim(contArr[nowGophers].children[1])
})

地鼠動畫
反正就是看cat的y移動

function gopherAnim(obj) {
  if (!obj.down) {
    obj.y -= Math.floor(des / (timeSec / 4)) //跳出來比較快用總距離150/(總時間的1/4)
  }
  if (obj.y < 0) {
    obj.down = true //跳上跳下控制
  }
  if (obj.down) {
    obj.y += Math.floor(des / ((timeSec / 4) * 3))//縮回去比較慢用總距離/(總時間的3/4)
    if (obj.y >= des) {
      reset(obj)
    }
  }
}
function reset(obj) {
  time = timeSec 
  // 這邊直接做設定把當前時間直接衝上全部時間是因為遇到時間差和距離差導致貓沒有回到洞裡
  // 這樣就會讓ticker那邊直接執行下一次的地鼠
  obj.y = des
  obj.down = false
  obj.hit = false
  // 其他就是回到預設值
}

監聽click事件的觸發事件,並計算分數

function hit() {
  if (!this.hit) count += 1
  this.hit = true
}

後記:
終於寫完最後一天了啊~~~!!!
但我覺得過完30天我還是不會寫PIXI
人生真難
演算真難
我開始懷疑我的人森

我這個月真的超多事情卡在一起QQQQQQ
還能完賽真是太驚人(雖然都是廢文ORZ

但參加這個還是滿好玩的(有病)
部門還寫上癮了
說甚麼再來下個30天
大家真可怕QQQQQ

身為小廢物的我只能寫出一些一知半解的東西
到底誰在看我的文章ㄚㄚㄚㄚ
好怕被罵喔QQQQQQQ

最後
我終於要解放啦~~~~~~~~~~~~
好感人~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


上一篇
Day29 簡易版打地鼠小遊戲(1) 畫出場景
系列文
30天Pixi帶你飛上天30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

2 則留言

0
King Tzeng
iT邦新手 3 級 ‧ 2018-11-14 00:08:06

喝蜂蜜檸檬壓壓驚!!!
恭喜恭喜~~~一起畢(ㄐㄧㄝˇ)業(ㄊㄨㄛ)啦~/images/emoticon/emoticon34.gif
有Demo可以玩一下嗎XDDDDD

就長那麼廢你也要玩QQQ
除了那張貓(我忘了前面有沒有放(應該有吧
其他前後兩天複製貼上應該就可以動了吧~~~
我幾乎全貼了~~~

不行就敲我粉絲團我傳給你XD

我要留言

立即登入留言